<docs>
</docs>
<template>
  <div :class="`weui-cell weui-cell_access ${valid === status.REJECTED ? 'weui-cell_warn' : ''}`"
   @click="initPicker">
    <div class="weui-cell__hd">
      <p class="weui-label">{{label}}</p>
    </div>
    <div class="weui-cell__ft text">{{dateTxt || labelName}}</div>
    <upload-pic
      :hasInitEvent.sync="hasInitEvent"
      :imgSrc="serverName"
      @update:serverName="dateImgT"
      @update:labelName="updateLabelName"></upload-pic>
  </div>
</template>
<script>
import uploadPic from 'base/form/upload/uploadPic';
import { mixinValid } from 'common/mixins/mixins';

export default {
  name: 'upload',
  components: { uploadPic },
  props: {
    serverName: String,
    label: String,
    dateTxt: String
  },
  mixins: [mixinValid],
  data() {
    return {
      hasInitEvent: false,
      labelName: '未上传'
    };
  },
  methods: {
    dateImgT(val) {
      this.$emit("update:serverName", val);
    },
    updateLabelName(val) {
      this.labelName = val;
    },
    initPicker() {
      this.hasInitEvent = true;
    }
  },
  watch: {
    labelName(val) {
      if (this.labelName) {
        this.resetValid();
        this.$emit('input', val);
      }
    }
  }
};
</script>
<style scoped lang="scss">
@import '~common/scss/var.scss';
.weui-label {
  @include label;
}
.text {
  text-align: left;
  flex: 1 1 auto;
  line-height: 1.2;
  color: #000;
  font-size: inherit;
  @include input-text;
}
</style>
